<template>
  <div>
      <!-- 传送门 -->
      <teleport to='.header'>
          <SdyHeader home="home" center="search"></SdyHeader>
      </teleport>
     <div class="container">
       <!-- 轮播图 -->
      <sdyBanner></sdyBanner>
      <!-- 九宫格 -->
      <sdyGrid></sdyGrid>
      <!-- 秒杀+热门 -->
      <sdyHot></sdyHot>
      <!-- 商品列表 -->
      <sdyList></sdyList>
      <!-- 回到顶部 -->
      <van-back-top class="back-top" right="20px" bottom="80px" />
     </div>
      

  </div>
</template>

<script name="sdyList" lang="ts" setup>
import SdyHeader from '../../components/header.vue'
import sdyBanner from './components/banner.vue'
import sdyGrid from './components/grid.vue'
import sdyHot from './components/hot.vue'
import sdyList from './components/list.vue'

</script>

<style scoped lang="scss">
.container{
  background-color: #f6f6f6;
}
.van-back-top--active{
  background-color: #50bb78 !important;
}
</style>

